import {createApp} from 'vue'
import App from './App.vue'
import router from './router'
import VueScrollTo from 'vue-scrollto'
import { MotionPlugin } from '@vueuse/motion'
import '@mdi/font/css/materialdesignicons.min.css'
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import { createPinia } from 'pinia'
import piniaPluginPersistedstate from 'pinia-plugin-persistedstate'

const pinia = createPinia()
pinia.use(piniaPluginPersistedstate)

createApp(App)
    .use(VueScrollTo, {
        container: 'body',
        duration: 500,
        easing: 'ease',
        offset: 0,
        force: true,
        cancelable: true,
        onStart: false,
        onDone: function (element) {
            if (element && element.id) {
                if (history.replaceState) {
                    history.replaceState(history.state, '', '#' + element.id)
                } else {
                    window.location.hash = '#' + element.id
                }
            }
        },
        onCancel: false,
        x: false,
        y: true,
    })
    .use(router)
    .use(MotionPlugin)
    .use(ElementPlus)
    .use(pinia)
    .mount('#app')
